<template>
	<view class="container">
		<u-gap :bg-color="bgColor" :height="height" :margin-top="marginTop" :margin-bottom="marginBottom"></u-gap>
		<view class="u-flex-col top">
			<image  src="../../static/img/tdtx.png" mode=""></image>
			<text>{{curriculumDetail.teacherName}}</text>
		</view>
		<view class="u-flex u-row-around u-m-t-45 middle">
			<image src="../../static/img/nrzl.png" mode=""></image>
			<image src="../../static/img/zzgg.png" mode=""></image>
		</view>
		<view class="u-m-l-28 u-m-t-75 kcjs u-flex">
			<image  src="../../static/img/kcjs.png" mode=""></image>
			<text class="u-font-34 u-m-l-15">课程介绍</text>
		</view>
		<view class="u-m-l-30 u-m-t-45 u-m-r-30">
			<view class="u-flex u-row-between u-border-bottom u-font-30 u-p-b-40">
				<text>课程说明</text>
				<text style="color: #9DA2B0;">{{curriculumDetail.name}}</text>
			</view>
			<view class="u-flex u-row-between u-border-bottom u-m-t-40 u-font-30 u-p-b-40">
				<text>课程编号</text>
				<text style="color: #9DA2B0;">{{curriculumDetail.num}}</text>
			</view>
			<view class="u-flex u-row-between u-border-bottom u-m-t-40 u-font-30 u-p-b-40">
				<text>专业方向</text>
				<text style="color: #9DA2B0;">{{curriculumDetail.direction}}</text>
			</view>
			<view class="u-flex u-row-between u-border-bottom u-m-t-40 u-font-30 u-p-b-40">
				<text>课程时长</text>
				<text style="color: #9DA2B0;">{{curriculumDetail.duration}}</text>
			</view>
			<view class="u-flex u-row-between u-border-bottom u-m-t-40 u-font-30 u-p-b-40">
				<text>授课方式</text>
				<text style="color: #9DA2B0;">{{curriculumDetail.methods==1?'线上':''}}</text>
			</view>
			<view class="u-flex u-row-between  u-m-t-40 u-font-30 u-p-b-40">
				<text>课程价值</text>
				<text style="color: #FE5022;">{{curriculumDetail.value}}</text>
			</view>
		</view>
		<u-gap :bg-color="bgColor" :height="height"  :margin-bottom="marginBottom"></u-gap>
		<view class="u-m-l-28  kcjs u-flex">
			<image  src="../../static/img/kcjstwo.png" mode=""></image>
			<text class="u-font-34 u-m-l-15">课程介绍</text>
		</view>
		<view class="bottom u-m-t-20 u-m-b-20 u-m-l-30 u-p-t-30 u-p-l-25 u-p-r-30">
			{{curriculumDetail.contents}}
		</view>
		<u-gap :bg-color="bgColor" :height="height"  :margin-bottom="marginBottom"></u-gap>
		<view class="u-flex u-row-between u-m-l-45 u-m-r-30">
			<view class="u-flex kcmx">
				<image  src="../../static/img/kcmx.png" mode=""></image>
				<text class="u-font-38" >课程明细</text>
			</view>
		</view>
		<view v-for="(item,index) in courseDetails" :key="index" class="kcxq u-m-l-30 u-m-t-40">
			<view class="u-m-l-30 u-m-r-30">
				{{item.name}}
			</view>
			<view class="u-m-l-30 u-m-r-30">
				{{item.content}}
			</view>
			<view class="kctp">
				<image style="width:121rpx;height:110rpx;" v-for="(v,i) in getUrls(item.url)" :key="i" :src="baseUrl + v"></image>
			</view>
		</view>
		<u-button v-if="syncCourse.isLeader" class="button" @click="submit">确认选择</u-button>
		<u-button v-else class="button" @click="pay">购买课程</u-button>
	</view>
</template>

<script>
	export default{
		
		data(){
			return{				
				baseUrl: this.$mConfig.baseUrl,
				height: 20,
				bgColor: this.$u.color.bgColor,
				marginTop: 30,
				marginBottom: 30,
				id: '',
				curriculumDetail: {},
				currentTab: 1,
				type: '',
				userId:'',
				body:{},
				syncCourse:'',
				courseDetails:'',
				selectDataId:''
			}
		},
		onShow() {
			this.selectCurriculumOne();
		},
		onLoad(options){
			let that = this;
			console.log("kc-options:",options);
			if(options.id){
				that.id = options.id;
			}
			this.body = {courseId:this.id,userIdentity:1};
			if(options.currentTab){
				that.currentTab = options.currentTab
			}
			if(options.type){
				that.type = options.type
			}
			if(options.selectDataId){
				this.body.courseId = options.selectDataId
			}			
			
			if(uni.getStorageSync('syncCourse')){
				var syncCourse = uni.getStorageSync('syncCourse');
				this.syncCourse = syncCourse;
				this.body.userId = syncCourse.userId?syncCourse.userId:syncCourse.id;
				if(syncCourse.userId) this.body.privateUserId = syncCourse.userId;
				this.body.groupId = syncCourse.id;
				this.body.type = syncCourse.type;
			}
			
			if(!this.body.userId) this.userId =  this.body.userId;
			console.log("body",this.body);
		},
		methods:{
			async pay() {
				var payData = { payMoney:this.curriculumDetail.value, type:1,id:this.syncCourse.id,courseId:this.id};
				let {data,code} = await this.$apis.createTeamPayCourse(payData);
				if(code == 200){
					data.payType = 2;
					this.$mRouter.push({
						route:this.$mRoutesConfig.pay,
						query:{
							datas:JSON.stringify(data)
						}
					});	
				}
			},
			getUrls(img){
				var imgs = [];
				if(img.indexOf(',') > -1){
					imgs = img.split(',');
				}else{
					imgs = [img];
				}
				console.log(imgs);
				return imgs;
			},			
			//查询课程详情
			async selectCurriculumOne(){
				let reqBody = {};
				reqBody['courseId'] = parseInt(this.id);
				let {data} = await this.$apis.selectCurriculumOne(reqBody);
				this.courseDetails = data.courseDetails
				this.curriculumDetail = data.course
			},
			async submit(){		
				var syncCourse = this.syncCourse;
				let {code} = await this.$apis.buyCurriculumOne(this.body);
				if(code == 200){
					var notepad = this.$mConstDataConfig.notepad;
					if(syncCourse.type){
						var type = parseInt(syncCourse.type) - 1,userId='';
						if(syncCourse.userId) userId = "&userId="+syncCourse.userId
						if(uni.getStorageSync('syncCourse')) uni.removeStorageSync('syncCourse')
						uni.showToast({
							title:"课程加入成功",
							success(){		
								uni.redirectTo({
									url:notepad[type].url+"?id="+syncCourse.id+"&teamChatId=team_"+syncCourse.id+userId
								})
							}
						})
					}
					// if(this.type == 1){
						
					// 	uni.showToast({
					// 		title:"课程已加入记事本",
					// 		success(){		
					// 			if(uni.getStorageSync('kcUserId') != ''){								
					// 				uni.redirectTo({
					// 					url:"/pages/notepad/zhihuiTeam/leagueMemberTwo?id="+this.userId+"&teamChatId=team_"+this.userId+"&userId="+this.userId
					// 				})
					// 			}else{
					// 				uni.redirectTo({
					// 					url:"/pages/notepad/zhihuiTeam/leagueMemberTwo?id="+this.userId+"&teamChatId=team_"+this.userId
					// 				})
					// 			}
					// 		}
					// 	})
					// }else if(this.type == 2){
					// 		uni.showToast({
					// 			title:"课程已加入记事本",
					// 			success(){		
					// 				if(uni.getStorageSync('kcUserId') != ''){			
					// 					uni.redirectTo({
					// 						url:"/pages/notepad/zhihuin1/index?id="+this.userId+"&teamChatId=team_"+this.userId+"&userId="+this.userId
					// 					})
					// 				}else{
					// 					uni.redirectTo({
					// 						url:"/pages/notepad/zhihuin1/index?id="+this.userId+"&teamChatId=team_"+this.userId
					// 					})
					// 				}
					// 			}
					// 		})
						
					// }
				}
				// let data = this.curriculumDetail;
				// data.wxy = this.currentTab == 1?"预设课程":"自设课程"
				// let query = encodeURIComponent(JSON.stringify(data))
				// uni.navigateTo({
				// 	url:"/pages/classroom/zhihuiClassroom?data="+query
				// })
			},
		},
		
	}
</script>

<style scoped lang="scss">
	.top{
		flex-direction: column;
		align-items: center;
		text{
			color: #4B9CFF;
			font-size: 38rpx;
			margin-top: 38rpx;
		}
		image{
			width: 115rpx; height: 132rpx;
		}
	}
	.middle{
		image{
			width: 312rpx;
			height: 182rpx;
		}
	}
	.kcjs{
		image{
			width: 36rpx; height: 33rpx;
		}
		text{
			color: #0D1D36;
			font-weight: bold;
		}
	}
	.bottom{
		width: 690rpx;
		height: 276rpx;
		background: #F5F5F9;
		border-radius: 20rpx;
		font-size: 30rpx;
		font-family: Source Han Sans SC;
		font-weight: 400;
		color: #9DA2B0;
		line-height: 46rpx;
	}
	.button {
		width: 662rpx;
		margin: 145rpx auto 91rpx auto;
		background: #ab61ff;
		border-radius: 40rpx;
		border: 0;
		color: #fff;
	
		font-size: 32rpx;
	
		&.u-hairline-border:after {
			border: 0;
		}
	}
	.kcmx{
		image{
			width: 34rpx; height: 38rpx;
		}
		text{
			font-weight: bold;
			margin-left: 11rpx;
		}
	}
</style>
